{$layout}

<p class="ui message" v-if="servers.length == 0">暂时还没有服务，<a href="/proxy/add">现在就去添加</a>。</p>

<p class="ui message warning" v-if="statusChanged">代理服务已被修改，<a href="" v-on:click.prevent="restart()">点此重启后生效</a></p>

<div class="servers-box">
    <div class="table-box" v-if="servers.length > 0" v-for="server in servers">
        <table class="ui table selectable">
            <thead>
                <tr>
                    <th colspan="5">
                        <a :href="'/proxy/detail?filename=' + server.filename" title="详情">{{server.config.description}} <i class="icon dot circle small green" title="最近10分钟有请求" v-if="server.isActive"></i> &raquo;<em v-if="server.config.root.length > 0"><i class="ui folder icon"></i>{{server.config.root}}</em></a>
                        <span>
                            <a :href="'/proxy/detail?filename=' + server.filename" title="详情"><i class="ui info icon circle"></i> </a>
                            <a href="" data-tea-action=".delete" v-bind:data-filename="server.filename" data-tea-confirm="您确定要删除此服务吗？" title="删除"><i class="ui icon remove circle"></i> </a>
                        </span>
                    </th>
                </tr>
                <tr>
                    <th>域名<em>用户在浏览器上访问的域名</em></th>
                    <th></th>
                    <th>绑定网络地址<em>代理服务器上绑定的网络地址</em></th>
                    <th></th>
                    <th>后端服务地址<em>提供服务的后端服务器网络地址</em></th>
                </tr>
            </thead>
            <tr>
                <td>
                    <span class="disabled" v-if="server.config.name.length == 0">还没有设置域名</span>
                    <div v-if="server.config.name.length > 0" class="fix-height">
                        <p v-for="name in server.config.name"><i class="ui icon edge"></i>{{name}}</p>
                    </div>
                </td>
                <td>
                    <i class="ui icon right arrow"></i>
                </td>
                <td>
                    <span v-if="server.config.listen.length == 0" class="disabled">还没有绑定网络地址</span>
                    <div v-if="server.config.listen.length > 0" class="grey fix-height">
                        <p v-for="listen in server.config.listen"><i class="ui icon paper plane outline"></i>{{listen}}</p>
                    </div>
                </td>
                <td>
                    <i class="ui icon right arrow"></i>
                </td>
                <td>
                    <span v-if="server.config.backends.length == 0 && server.fastcgi.length == 0" class="disabled">还没有设置后端服务地址</span>
                    <div class="fix-height" v-if="server.config.backends.length > 0">
                        <p v-for="backend in server.config.backends"><i class="ui icon hdd outline"></i> <em>[Http] </em>{{backend}}</p>
                    </div>
                    <div class="fix-height" v-if="server.fastcgi.length > 0">
                        <p v-for="fastcgi in server.fastcgi"><i class="ui icon folder outline"></i> <em>[Fastcgi] </em>{{fastcgi}}</p>
                    </div>
                </td>
            </tr>
        </table>
    </div>
    <div class="clear"></div>
</div>


